<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:replace="end/include/head">
<body style='overflow:scroll;overflow-x:hidden'>
	<div class="container bs-docs-container" style="width:100%;">
		<div class="row">
			<div class="panel panel-default">
				<div class="panel-heading">分配权限</div>
				<div class="panel-body">
					<form class="form-horizontal" role="form" id="dailogForm" th:action="@{/role/doAssign.do}" method="POST">
						<input type="hidden" id="btn_sub" class="btn_sub" />
						<input type="hidden" id="ids" name="ids"/>
						<input type="hidden" th:value="${role.id}" name="id" id="id" />
                        <div id="menuContent" class="menuContent">
                            <ul id="treeDemo" class="ztree" style="margin-top:0; width:200px;"></ul>
                        </div>
                        <div class="form-group mno">
                            <div class="col-sm-offset-1 col-sm-6">
								<button type="button" class="btn btn-default" id="formReturn" data-dismiss="modal" th:onclick="'doUrl(\''+ @{/role/list.do} +'\');'">返回</button>
                                <button type="button" class="btn btn-primary" id="formSubmit">提交</button>
                            </div>
                        </div>
					</form>
				</div>
			</div>
		</div>
	</div>
</body>
</html>
<script type="text/javascript" th:src="@{/plug-in-ui/project/js/Validform_v5.3.2.js}"></script>
<script type="text/javascript" th:src="@{/plug-in-ui/project/js/forminit.p3.js}"></script>
<script type="text/javascript" th:src="@{/plug-in-ui/zTree/jquery.ztree.core.js}"></script>
<script type="text/javascript" th:src="@{/plug-in-ui/zTree/jquery.ztree.excheck.js}"></script>
<script type="text/javascript" th:src="@{/plug-in-ui/zTree/jquery.ztree.exedit.js}"></script>
<script type="text/javascript">
    var IDMark_A = "_a";

    function showMenu() {
        var cityObj = jQuery("#parentFunctionId");
        var cityOffset = jQuery("#parentFunctionId").offset();
        if(jQuery("#menuContent").is(':hidden')){
            jQuery("#menuContent").css({left:cityOffset.left + "px", top:cityOffset.top + cityObj.outerHeight() + "px"}).slideDown("fast");
        }else{
            jQuery("#menuContent").fadeOut("fast");
        }
        jQuery("body").bind("mousedown", onBodyDown);
    }
    function hideMenu() {
        jQuery("#menuContent").fadeOut("fast");
        jQuery("body").unbind("mousedown", onBodyDown);
    }
    function onBodyDown(event) {
        if (!(event.target.id == "parentFunctionId" || event.target.id == "menuContent" || jQuery(event.target).parents("#menuContent").length>0)) {
            hideMenu();
        }
    }

    var setting = {
        check: {
            enable: true,
            chkStyle : "checkbox",
            chkboxType : { "Y" : "p", "N" : "s" }
        },
        view: {
            //addHoverDom: addHoverDom,
            //removeHoverDom: removeHoverDom,
            dblClickExpand: false
        },

        data: {
            key: {
                name: "functionname"
            },
            simpleData: {
                enable: true,
                idKey: "id",
                pIdKey: "parentFunctionId",
                rootPId: null
            }
        },
        callback: {
            onClick: onClick,
            onCheck: onCheck
        }
    };
    function onClick(e, treeId, treeNode) {
        var tree = zTree.getZTreeObj("treeDemo");
        tree.checkNode(treeNode, !treeNode.checked, null, true);
        return false;
    }
    function onCheck(e, treeId, treeNode) {
        var tree = zTree.getZTreeObj("treeDemo"),
                nodes = tree.getCheckedNodes(true),
                v = "",vid = "";
        for (var i=0, l=nodes.length; i<l; i++) {
            v += nodes[i].functionname + ",";
            vid += nodes[i].id + ",";
        }
        if (v.length > 0 ) v = v.substring(0, v.length-1);
        if (vid.length > 0 ) vid = vid.substring(0, vid.length-1);
        jQuery("#parentFunctionId").val(v);
        $("#ids").val(vid);
		console.log("v : " + v);
		console.log("vid : " + vid);
    }
    function addHoverDom(treeId, treeNode) {
        if (treeNode.parentNode && treeNode.parentNode.id!=1) return;
        var aObj = jQuery("#" + treeNode.tId + IDMark_A);
        if (jQuery("#diyBtn_"+treeNode.id).length>0) return;
        var editStr = "<span id='diyBtn_" +treeNode.id+ "'>编码:"+treeNode.id+"</span>";
        aObj.after(editStr);
    }
    function removeHoverDom(treeId, treeNode) {
        jQuery("#diyBtn_"+treeNode.id).unbind().remove();
        jQuery("#diyBtn_space_" +treeNode.id).unbind().remove();
    }

    var zNodes;
    jQuery(document).ready(function(){
        jQuery.ajax({
            async : false,
            cache:false,
            type: 'POST',
            dataType : "json",
			url: '[[${basePath}]]/function/tree.do',//请求的action路径
            error: function () {//请求失败处理函数
                alert('请求失败');
            },
            success:function(data){ //请求成功后处理函数。
                zNodes = data;   //把后台封装好的简单Json格式赋给zNodes
                console.log(zNodes);
            }
        });
        zTree.init(jQuery("#treeDemo"), setting, zNodes);
		var array = new Array()
		var functionIdList = "[[${functionIdList}]]"
        console.log("functionIdList " + functionIdList);
		array = functionIdList.split(",");

		var tree = zTree.getZTreeObj("treeDemo");
		$.each(array,function(i,m){
			console.log("m : " + m);
			var node = tree.getNodeByParam("id",m,null);
			tree.checkNode(node,true,true);
		});
		tree.expandAll(true);
	});
</script>